<template>
  <view class="wrapper">
    <view class="content">
      <u-cell-group>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex">
            <view class="w-180 c-99"> 仓库名称: </view>
            <view class="flex-1">
              <u--input v-model="listData.name" placeholder="请输入内容" border="none"></u--input>
            </view>
          </view>
          <!-- <clIcon v-if="this.id" slot="right-icon" @click="neoIconDelect()" class="" type="icon-shanchu" color="#000"
            size="20"></clIcon> -->
        </u-cell>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex" @click="typeShow = true">
            <view class="w-100 c-99"> 类型: </view>
            <view class="w-300">
              {{ listData.typeName }}
            </view>
          </view>
        </u-cell>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex" @click="
            btnSelectGoods(
              '/pages/application/pages/information/warehouse/warehouse-details/category/category'
            )
            ">
            <view class="w-100 c-99"> 类别: </view>
            <view class="flex-1">
              <view class="w-300">
                {{ listData.catName }}
              </view>
            </view>
          </view>
        </u-cell>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex" @click="mendianShow = true">
            <view class="w-100 c-99"> 门店: </view>
            <view class="flex-1">
              <view class="w-300">
                {{ listData.shopName }}
              </view>
            </view>
          </view>
        </u-cell>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex">
            <view class="w-100 c-99"> 地址: </view>
            <view class="flex-1">
              <u--input v-model="listData.address" placeholder="请输入内容" border="none"></u--input>
            </view>
          </view>
        </u-cell>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex">
            <view class="w-100 c-99"> 备注: </view>
            <view class="flex-1">
              <u--input v-model="listData.remarks" placeholder="请输入内容" border="none"></u--input>
            </view>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="flex justify-between">
            <view class="flex-sb">
              <view class="flex w-300 flex-aic">
                <view class="w-200 c-99"> 是否默认: </view>
                <text class=""><u-switch @change="switchChange($event, 1)" v-model="listData.isDefault"></u-switch></text>
              </view>

              <view class="flex-1 flex-sb p-l-20">
                <view class="w-100 c-99"> 启用: </view>
                <text class=""><u-switch @change="switchChange($event, 2)" v-model="listData.isEnable"></u-switch></text>
              </view>
            </view>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="flex justify-between">
            <view class="flex-sb">
              <view class="flex w-300 flex-aic">
                <view class="w-100 c-99"> 条码: </view>
                <text class=""><u-switch @change="switchChange($event, 3)" v-model="listData.isBarcode"></u-switch></text>
              </view>

              <view class="flex-1 flex-sb p-l-20">
                <view class="w-100 c-99"> 明细: </view>
                <text class=""><u-switch @change="switchChange($event, 4)" v-model="listData.isDetail"></u-switch></text>
              </view>
            </view>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="flex justify-between">
            <view class="flex-sb">
              <view class="flex w-300 flex-aic">
                <view class="w-250 c-99"> 允许负库存: </view>
                <text class=""><u-switch @change="switchChange($event, 5)"
                    v-model="listData.isNegStock"></u-switch></text>
              </view>

              <view class="flex-1 flex-sb p-l-20">
                <view class="w-100 c-99"> 批次: </view>
                <text class=""><u-switch @change="switchChange($event, 6)"
                    v-model="listData.isBatchNumber"></u-switch></text>
              </view>
            </view>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="flex justify-between">
            <view class="flex-sb">
              <view class="flex-1 flex-sb">
                <view class="w-130 c-99"> 次品库: </view>
                <text class=""><u-switch @change="switchChange($event, 8)"
                    v-model="listData.isDefective"></u-switch></text>
              </view>
            </view>
          </view>
        </u-cell>
        <u-gap height="5" v-if="listData.isPosition" bgColor="#eee"></u-gap>
      </u-cell-group>
    </view>
    <!-- 选择器 -->
    <u-picker keyName="label" :show="typeShow" :columns="typeColumns" @cancel="typeShow = false"
      @confirm="typeConfirm"></u-picker>
    <u-picker keyName="label" :show="mendianShow" :columns="mendianColumns" @cancel="mendianShow = false"
      @confirm="mendianConfirm"></u-picker>


  </view>
</template>

<script>
import clIcon from "@/components/cl-icon/cl-icon.vue";
import {
  getCategoryList,
  getTypeList,
  delectData,
  getIdData,
} from "@/apis/bill/information/warehouse";
import {
  getlist
} from "@/apis/bill/information/shop";
export default {
  components: {
    clIcon,
  },
  data() {
    return {
      typeShow: false,
      typeColumns: [],

      mendianShow: false,
      mendianColumns: [],

      weightName: "g",
      weightShow: false,
      weightColumns: [["g", "g/m", "g/㎡"]],
      listData: {
        // address: null, //地址
        // addressDetailIds: "", // 地址的码110000,110100,110102
        // addressFull: null, //地址的具体地址
        // positionList: [
        //   {
        //     seq: "",
        //     name: "",
        //     sort: "",
        //     barcode: "",
        //     isEnable: "",
        //     remarks: "备注",
        //   },
        // ], //仓位
        // remarks: "", //备注
        // shopName: "", // 门店 传name
        // shopId: '',
        // typeName: "", // 类型 布匹 name
        // typeId: null,
        // name: "", //仓库名称
        // catId: "", //类别 的id
        // catName: "", //类别 的name
        // isDefault: false, // 是否默认
        // isEnable: true, // 是否启用
        // isBarcode: false, // 条形码
        // isDetail: false, // 是否明细
        // isNegStock: false, // 是否允许负库存, true是允许
        // isBatchNumber: false, // 是否启用批次号
        // isPosition: false, // 是否开启仓位
        // isDefective: false, // 是否次品仓
      },
    };
  },
  computed: {},
  props: {
    id: {
      type: String || Number,
      default: null,
    },
    data: {
      type: Object,
      default: null,
    },
    
  },
  onLoad() { },
  onReady() { },
  created() {
    uni.$on("onInformationWarehouseCategory", (data) => {
      this.listData.catId = data.data.id
      this.listData.catName = data.data.name
    });
    this.listData = this.data
    this.getTypeLists();
    this.getIdShwoDatas()
  },
  watch:{
    data(n,o){
      this.listData = n
    }
  },
  methods: {
    getIdShwoDatas(id) {
      getlist().then((res) => {
        if (!res.flag) return;
        this.mendianColumns.push(res.data);
      });
    },
    getIdDatas(id) {
      getIdData(id).then((res) => {
        if (!res.flag) return;
        this.listData = res.data;
      });
    },
    neoIconDelect() {
      // 删除功能
      delectData(this.id).then((res) => {
        if (!res.flag) return;
      });
    },

    // 选择器
    switchChange(is, item) {
      switch (item) {
        case 1:
          this.listData.isDefault = is;
          break;
        case 2:
          this.listData.isEnable = is;
          break;
        case 3:
          this.listData.isBarcode = is;
          break;
        case 4:
          this.listData.isDetail = is;
          break;
        case 5:
          this.listData.isNegStock = is;
          break;
        case 6:
          this.listData.isBatchNumber = is;
          break;
        case 7:
          this.listData.isPosition = is;
          break;
        case 8:
          this.listData.isDefective = is;
          break;
        default:
          break;
      }
    },
    // getCategoryList
    getCategoryLists() {
      getCategoryList().then((res) => {
        if (!res.flag) return;
        const data = res.data || {};
        // this.categoryColumns.push(data)
      });
    },
    getTypeLists() {
      getTypeList().then((res) => {
        if (!res.flag) return;
        const data = res.data || {};
        this.typeColumns.push(data);
      });
    },

    btnSelectGoods(url) {
      if (!url) return;
      this.$Router.push({
        path: url,
        query: {
          url: "/pages/application/pages/information/warehouse/warehouse-details/warehouse-details",
        },
      });
    },
    typeConfirm(e) {
      this.listData.typeName = e.value[0].label;
      this.listData.typeId = e.value[0].value;

      this.typeShow = !this.typeShow;
    },
    mendianConfirm(e) {
      this.listData.shopName = e.value[0].shopName;
      this.listData.shopId = e.value[0].shopId;
      this.mendianShow = !this.mendianShow;
    },
  },
  beforeDestroy() {
    uni.$off("onInformationWarehouseCategory");
  },
};
</script>

<style lang="scss" scoped>
.wrapper {
  // height: 100%;
  background-color: #fff;

  .content {
    flex: 1;
    overflow-y: scroll;
  }

  .fixed-btn {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20rpx 30rpx 20rpx;
    background: #fafafa;

    .card-btn {
      color: #409eff !important;
      border-radius: 40rpx 0 0 40rpx;
    }

    .save-btn {
      border-radius: 0 40rpx 40rpx 0;
    }
  }
}
</style>